<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Ajax基本使用</title>
</head>
<body>
	<input id="btnLoad" type="button" value="加载">
	<div id="divContent"></div>
	<script>
		document.getElementById("btnLoad").onclick = function(){
			//1. 创建XmlHttpRequest对象 由浏览器的不通创建xmlhttp 会有些不通 通过window.XMLHttpRequest boolean值来判断
			var xmlhttp;
			if(window.XMLHttpRequest){
			    // 支持IE7,Firefox,chrome,opera,Safari浏览器 创建对象的方法 new XMLHttpRequest()
				xmlhttp = new XMLHttpRequest();
			}else{
			    //支持老的IE6,IE5浏览器的
				xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
			}
			console.log(xmlhttp);
			//2. 发送Ajax请求
			xmlhttp.open("GET" , "http://localhost:8080/jdbc/Servlet1" , true);// true 表示为异步请求
			// xmlhttp.open("GET" , "/jdbc/Servlet1" , true);
			xmlhttp.send();
			//3. 处理服务器响应
			xmlhttp.onreadystatechange = function(){

                // xmlhttp.readyState == 0 请求未初始化
                // xmlhttp.readyState == 1 服务器连接已建立
                // xmlhttp.readyState == 2 请求已被接受
                // xmlhttp.readyState == 3 请求正在处理
                // xmlhttp.readyState == 4 响应文本已被接受

				// xmlhttp.status == 200 (Servlet http 常见状态码 )

                if(xmlhttp.readyState == 4 && xmlhttp.status == 200){
					var strResponse = xmlhttp.responseText;

                    var jsonBean = JSON.parse(strResponse);
					Ulog.i(jsonBean.message);
					document.getElementById("divContent").innerHTML =jsonBean.message;
				}
			}
		}
	</script>
</body>
</html>